<nav class="navbar navbar-dark bg-primary flex-row">
  <img src="assets/icon256.svg" height="32" width="32" class="mr-2" />
  <a class="navbar-brand mb-0 h1" [routerLink]="['']">
    CloudFlow
  </a>

  <ul class="navbar-nav flex-row">
    <li class="nav-item" ngbTooltip="Search by entity ID" container="body" placement="bottom">
      <a class="nav-link" [routerLink]="['/search']">
        <i class="fa fa-search"></i>
      </a>
    </li>

    <li class="nav-item ml-2" ngbTooltip="Browse recent executions" container="body" placement="bottom">
      <a class="nav-link" [routerLink]="['/executions']">
        <i class="fa fa-list"></i>
      </a>
    </li>

  </ul>

  <ul class="navbar-nav ml-auto flex-row">
    <li class="nav-item">
      <a class="nav-link p-2 pointer" (click)="about()">About</a>
    </li>

    <li class="nav-item" *ngIf="isLoggedIn" id="logout">
      <a class="nav-link pl-2 pointer" (click)="logout()">Logout</a>
    </li>

  </ul>

</nav>

<div class="container-fluid main-container p-0">

  <router-outlet></router-outlet>

</div>